{% extends "jb_admin/naked_base.html" %}
{% load static %}
{% load jsonify %}

{% block cus_head %}
<title>用户注册</title>
{% endblock %}

{% block page_content %}
<script src='{% static "js/jb_admin.pack.js" %}?t={{ js_stamp.jb_admin_pack_js }}'></script>
<script src="{{ js_config.js_lib.authuser }}"></script>
<script type="text/javascript">

    fields_logic={
        el:'#there',
        data:{
            page_label:page_label,
            heads:heads,
            row:row,
            director_name:director_name,

            ops:ops,

            tr:cfg.tr,
            step:'on-rigist'

        },
        mixins:[mix_fields_data,mix_nice_validator],
        computed:{
            has_select:function(){
                return this.selected.length !=0
            },
            is_mobile:function(){
                return ! ex.device.pc
            }
        },
        mounted:function(){
            var self=this
            ex.assign(this.op_funs,{
                row_changed:function(kws){
                    var row= kws.row
                    if(!ex.isin(row,self.changed_rows)){
                        self.changed_rows.push(row)
                    }
                },
                row_changed_undo_act:function(kws){
                    var md5= ex.hashDict(kws.row)
                    if(md5 == kws.row._hash){
                        ex.remove(self.changed_rows,{pk:kws.row.pk})
                    }
                },
                switch_to_tab:function(kws){
                    self.show_tab(kws.tab_name)
                    self.crt_row= kws.row
                },
                update_or_insert:function(kws){
                    var new_row = kws.new_row
                    var old_row= kws.old_row
                    self.update_or_insert(new_row,old_row)
                },

            })

        },
        methods:{
            after_save:function(new_row){
                this.step='on-success'
                setTimeout(function(){
                    var next=ex.parseSearch().next
                    if(next){
                        location=decodeURIComponent(next) ;
                    }else{
                        location='/'
                    }
                },4000)


            },
            get_attr:function(name){
                if(name == undefined){
                    return false
                }
                if(name.startsWith('!')){
                    name=name.slice(1)
                    name= name.trim()
                    return !this[name]
                }else{
                    name= name.trim()
                    return this[name]
                }
            },

        }

    }

    $(function () {

//        if(extra_fields_logic){
//            fields_logic.mixins.push(window[extra_fields_logic])
//        }

        fields = new Vue(fields_logic)

    })

 </script>
<style>
    body{
        background-color: #f9f9f9;
    }

    .regist-form{
        padding: 1rem 6rem;
        width: 50rem;
        max-width: 50rem;
        margin: auto;
        background-color: white;
        border: 1px solid #eeeeee;
        margin-top: 3rem;
        border-radius: 0.2rem;
    }

    @media (max-width: 750px) {
        .regist-form {
            width: auto;
            padding: 0 2rem;
            margin-top:0 ;
        }
    }



    [v-cloak]{
        display: none;
    }
</style>
<div id="there" :class="['regist-form',{'mobile':is_mobile}]">
    <div v-show="step=='on-rigist'" >
        <com-login-banner></com-login-banner>

        <com-sim-fields :heads="heads" :row="row" ok-btn="注册"
                         @submit="submit" @after-save="after_save"></com-sim-fields>
    </div>
    <div v-cloak v-show="step=='on-success'" style="text-align: center">
        <h2>注册成功，现在跳转！</h2>
    </div>

</div>


{% endblock %}